<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        #textBox {
           color: gray;
        }
    </style>
</head>
<body>
    <input type="text" id="textBox" onfocus="jujiao()" onblur="bujujiao()" value="请输入内容">

    <script>
        function jujiao() {
            let textBox = document.getElementById('textBox');
            let defaultText = '请输入内容';
            
            if (textBox.value === defaultText) {
                textBox.value = '';
                textBox.style.color = 'black';
            }
        }

        function bujujiao() {
            let textBox = document.getElementById('textBox');
            let defaultText = '请输入内容';
            
            if (textBox.value === '') {
                textBox.value = defaultText;
                textBox.style.color = 'gray';
            }
        }
    </script>
</body>
</html>